import { memo } from 'react';
import type { ReactNode, FC } from 'react';
import { MetaIconWrapper } from './style';
import { imageMap, RadioIDMap } from '@/assets/data/loacl_data';
interface IProps {
  children?: ReactNode;
  name: string;
  img: string;
  className?: string;
}

const MetaIcon: FC<IProps> = (props) => {
  const { name, img, className } = props;
  const imgPath = imageMap[img] || null;
  return (
    <MetaIconWrapper img={imgPath} to={`/discover/radio/categroy?id=${RadioIDMap[name]}`} className={className}>
      <div className="metaImg"></div>
      <em>{name}</em>
    </MetaIconWrapper>
  );
};

export default memo(MetaIcon);
